﻿
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>查询分页</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 注意：项目正式环境请勿引用该地址 -->
    <link href="~/lib/layui/css/layui.css" rel="stylesheet" />
</head>
<body>
    <h3>videoaid获取方式点击F12之后，跟着下图操作，右击图片在新的标签页中开打</h3> <img src="~/images/1656055091043.jpg" style="height:50px;width:80px" />
                                                      
    <div class="demoTable">
        请输入视频的videoaid：
        <div class="layui-inline">
            <input class="layui-input" name="id" id="demoReload" autocomplete="off">
        </div>
        评论区页数：
        <div class="layui-inline">
            <input class="layui-input" name="id" id="yeshu" autocomplete="off" value="1">
        </div>
        <button class="layui-btn" data-type="reload">搜索</button>
    </div>
    <table class="layui-hide" id="LAY_table_user" lay-filter="user"></table>
    <!-- 注意：项目正式环境请勿引用该地址 -->
    <script src="~/lib/jquery/dist/jquery.js"></script>
    <script src="~/lib/layui/layui.js"></script>
    <script>
        $('.demoTable .layui-btn').on('click', function () {
            var table = layui.table;
            var demoReload = layui.$('#demoReload').val();
            var yeshu = layui.$('#yeshu').val();
            if (demoReload == "" || yeshu == "") {
                layer.msg("请输入查询参数");
            } else {
                //方法级渲染
                table.render({
                    elem: '#LAY_table_user'
                    , url: 'api/chat/Index'
                    , where: { "videoaid": demoReload, "a": yeshu }
                    , cols: [[
                        { field: 'mid', title: 'B站id', width: 120, fixed: true }
                        , { field: 'uname', title: '个性名字', width: 120 }
                        , { field: 'like', title: '收获点赞', width: 120, sort: true }
                        , { field: 'message', title: '评论内容' }
                        , { field: 'ctime', title: '评论时间', sort: true, width: 200, templet: "<div>{{layui.util.toDateString(d.ctime*1000, 'yyyy-MM-dd HH:mm:ss')}}</div>" }
                        , { field: 'rcount', title: '获得回应', sort: true, width: 120 }
                    ]]
                    , id: 'testReload'
                    //加分页功能
                    , page: true
                    , limits: [5,10, 20, 50]  //一页选择显示3,5或10条数据
                    , limit: 20  //一页显示20条数据
                    , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据，res为从url中get到的数据
                        var result;
                        console.log(this);
                        console.log(JSON.stringify(res));
                        if (this.page.curr) {
                            result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
                        }
                        else {
                            result = res.data.slice(0, this.limit);
                        }
                        return {
                            "code": res.code, //解析接口状态
                            "msg": res.msg, //解析提示文本
                            "count": res.count, //解析数据长度
                            "data": result //解析数据列表
                        };
                    }
                });
            }

        });
    </script>
</body>
</html>
